<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title>菜单管理</title>



    <link rel="shortcut icon" href="favicon.ico">
    <link href="css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="css/plugins/footable/footable.core.css" rel="stylesheet">
    <link href="css/animate.css" rel="stylesheet">
    <link href="css/style.css?v=4.1.0" rel="stylesheet">
    <link href="css/plugins/datapicker/datepicker3.css" rel="stylesheet">


</head>

<body class="gray-bg">
<div class="animated fadeInRight">

    <div class="row">

        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>菜单信息</h5>


                </div>
                <div class="ibox-content">
                    <table class="footable table table-stripped toggle-arrow-tiny" data-page-size="8" id="tab1" >
                        <thead>
                        <tr>

                            <th data-toggle="true">代码</th>
                            <th>父菜单代码</th>
                            <th>菜单名称</th>
                            <th>访问地址（url）</th>
                            <th>排序</th>
                            <th>备注</th>
                            <th>所属系统</th>

                        </tr>
                        </thead>
                        <tbody >
                        <tr>
                            <td>01</td>
                            <td>0</td>
                            <td>基础信息管理</td>
                            <td>/infomanage/index.html</td>
                            <td>1</td>
                            <td>无</td>
                            <td>农村公路子系统</td>
                            <td><a onclick="modify(this)"><i class="fa fa-wrench"></i> 修改</a></td>
                            <td><a onclick="remove(this)"><i class="fa fa-times"></i> 删除</a></td>
                        </tr>
                        <!--<tr>-->
                            <!--<td>哈尔滨市站</td>-->
                            <!--<td>1500000</td>-->
                            <!--<td>市级</td>-->
                            <!--<td>哈尔滨市</td>-->
                            <!--<td>1555555</td>-->
                            <!--<td><a onclick="modify(this)"><i class="fa fa-wrench"></i> 修改</a></td>-->
                            <!--<td><a onclick="remove(this)"><i class="fa fa-times"></i> 删除</a></td>-->
                        <!--</tr>-->
                        <!--<tr>-->
                            <!--<td>道里区</td>-->
                            <!--<td>150010</td>-->
                            <!--<td>区级</td>-->
                            <!--<td>哈尔滨</td>-->
                            <!--<td>111</td>-->
                            <!--<td><a onclick="modify(this)"><i class="fa fa-wrench"></i> 修改</a></td>-->
                            <!--<td><a onclick="remove(this)"><i class="fa fa-times"></i> 删除</a></td>-->
                        <!--</tr>-->

                        </tbody>

                        <tfoot>
                        <tr>
                            <td colspan="9">
                                <ul class="pagination pull-right"></ul>
                            </td>
                        </tr>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>菜单信息增加</h5>
                    <!--<div class="ibox-tools">-->
                    <!--<a class="collapse-link">-->
                    <!--<i class="fa fa-chevron-up"></i>-->
                    <!--</a>-->
                    <!--<a class="dropdown-toggle" data-toggle="dropdown" href="form_basic.html#">-->
                    <!--<i class="fa fa-wrench"></i>-->
                    <!--</a>-->
                    <!--<ul class="dropdown-menu dropdown-user">-->
                    <!--<li><a href="form_basic.html#">选项1</a>-->
                    <!--</li>-->
                    <!--<li><a href="form_basic.html#">选项2</a>-->
                    <!--</li>-->
                    <!--</ul>-->
                    <!--<a class="close-link">-->
                    <!--<i class="fa fa-times"></i>-->
                    <!--</a>-->
                    <!--</div>-->
                </div>
                <div class="ibox-content" class="form-horizontal">
                    <form method="get" class="form-horizontal" action="">
                        <div class="form-group" >
                            <label class="col-sm-2 control-label">代码</label>
                            <div class="col-sm-8">
                                <input id="num" name="num" class="form-control" type="text">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">父菜单代码</label>
                            <div class="col-sm-8">
                                <input type="text" id = "fatherNum" class="form-control">
                            </div>
                        </div>
                        <div class="form-group" >
                            <label class="col-sm-2 control-label">菜单名称</label>
                            <div class="col-sm-8">
                                <input id="name" name="name" class="form-control" type="text">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">url</label>
                            <div class="col-sm-8">
                                <input type="text" id = "url" class="form-control">
                            </div>
                        </div>


                        <div class="form-group">
                            <label class="col-sm-2 control-label">排序</label>
                            <div class="col-sm-8">
                                <input id="arrange" name="comment" class="form-control" required="" aria-required="true">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">备注</label>
                            <div class="col-sm-8">
                                <input type="text" id = "notice" class="form-control">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">所属系统</label>
                            <div class="col-sm-8">
                                <input type="text" id = "system" class="form-control">
                            </div>
                        </div>
                        <div class="hr-line-dashed"></div>
                        <div class="form-group">
                            <div class="col-sm-4 col-sm-offset-2">
                                <!--<button class="btn btn-primary" onclick="save()">保存内容</button>-->
                                <button class="btn btn-primary" id="btn1">保存内容</button>
                                <button class="btn btn-white" onclick="cancel()">取消</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 全局js -->
<script src="js/jquery.min.js?v=2.1.4"></script>
<script src="js/bootstrap.min.js?v=3.3.6"></script>
<script src="js/plugins/footable/footable.all.min.js"></script>

<!-- 自定义js -->
<script src="js/content.js?v=1.0.0"></script>
<script type="text/javascript" src="js/menuManage.js"></script>
<script src="js/plugins/datapicker/bootstrap-datepicker.js"></script>
<script>
    $(document).ready(function() {
        $('.footable').footable();

    });


</script>
<script>
    window.onload=function () {
        var oTab=document.getElementById("tab1");
        var oTxt=document.getElementById("txt1");
        var oBtn=document.getElementById("btn1");
        oBtn.onclick=function () {
            for(var i=0;i<=oTab.tBodies[0].rows.length;i++){
                if(oTab.tBodies[0].rows[i].cells[3].innerHTML===oTxt.value){



                }
            }
        }


    }


</script>
<script>

    window.onload=function() {
        ajax('/menu/bypage?page=1&size=10', {}, 'GET', function (str) {

            var Obj = eval("(" + str + ")");


            var otr = "";

            for (var i = 0; i < Obj.data.length; i++) {
                otr += "<tr ></tr>";
                otr += "<td style='display: none'>" + Obj.data[i].id + "</td>";
                otr += "<td>" + Obj.data[i].funOrMenu + "</td>";
                otr += "<td>" + Obj.data[i].pcode + "</td>";
                otr += "<td>" + Obj.data[i].menuName + "</td>";
                otr += "<td>" + Obj.data[i].menuUrl + "</td>";
                otr += "<td>" + Obj.data[i].border + "</td>";
                otr += "<td>" + Obj.data[i].remark + "</td>";
                otr += "<td>" + Obj.data[i].childP + "</td>";
                otr += "<td>" + '<a class="a1" onclick=xiugai(this)><i class="fa fa-wrench"></i> 修改</a>' + "</td>";
                otr += "<td>" + '<a class="a2" onclick=shanchu(this)><i class="fa fa-wrench"></i> 删除</a>' + "</td>"
            }

            document.getElementsByTagName('tbody')[0].innerHTML = otr;
        }, function () {
            alert('链接失败')

        })

        var obtn1 = document.getElementById("btn1");
        var mn;
        var fm;
        var bd;
        var pc;
        var mu;
        var rm;
        var cp;
        obtn1.onclick = function () {
           mn=document.getElementById("name").value;
           fm=document.getElementById("num").value;
           bd=document.getElementById("arrange").value;
           pc=document.getElementById("fatherNum").value;
           mu=document.getElementById("url").value;
           rm=document.getElementById("notice").value
           cp=document.getElementById("system").value;
            ajax('/menu', {data: [{
                    menuName: mn,
                    funOrMenu: fm,
                    border: bd,
                    pcode: pc,
                    menuUrl: mu,
                    remark: rm,
                    childP: cp}]}, 'POST', console.log)



        }
    }
    function shanchu(cell) {
        var tr = cell.parentNode.parentNode;//input --> td --> tr
        var table = document.getElementsByTagName("table")[0]

                ajax('/menu', {
                    data: [{
                        id:tr.cells[0].innerHTML
                    }]
                }, 'delete', function () {
                    table.deleteRow(tr.rowIndex)
                }, function () {
                    alert('失败')

                })
    }

    function xiugai(cell){
        tr = cell.parentNode.parentNode;//input --> td --> tr
        var text = tr.cells[4].innerText;
        //console.log(tr.cells[2].innerText);
        tr.cells[4].innerHTML = '<input id="comment' + tr.rowIndex + '" name="comment"' +
            'class="form-control" aria-required="true">';
        tr.cells[8].innerHTML = '<a onclick="queren(this)"><i class="fa fa-wrench"></i> 确认</a>';
        var comment = document.getElementById("comment" + tr.rowIndex);
        comment.value = text;
    }

    function queren(cell){
        var tr = cell.parentNode.parentNode;//input --> td --> tr
        // console.log(tr.cells[2].innerText);
        var comment=document.getElementById('comment' + tr.rowIndex).value;
        // alert(comment)
        ajax('/menu', {data: [{id:tr.cells[0].innerHTML,
                menuUrl:comment
            }]}, 'PATCH', function () {
            tr.cells[4].innerHTML = comment;
            tr.cells[8].innerHTML = '<a onclick="xiugai(this)"><i class="fa fa-wrench"></i> 修改</a>';
        })
    }
</script>
<script type="text/javascript" src="js/service/service.js"></script>

</script>

<!--统计代码，可删除-->

</body>

</html>
